<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:th="http://www.thymeleaf.org">
<head>
	<meta  charset="utf-8"/>
    <meta name="description" content="U联赛是中国大学生" />
    <meta name="Keyword" content="U联赛，大学生篮球联赛，大学篮球，篮球联赛" />
	<title>精彩图库</title>
	<link rel="stylesheet" type="text/css" href="../../../admin/site/common/css/global.css"/>
	<script type="text/javascript" src="../../../admin/site/common/js/jquery-1.8.2.min.js"></script>

</head>
<body>
	<div class="page">
		<div class="toper">
		</div><!--顶部广告banner-->
		<div class="header" id="header">
			<input id="sessionWeixin" type="hidden" th:value="${session.indexWeixin}"/>
			<input id="sessionFans" type="hidden" th:value="${session.indexFans}"/>
			<input id="sessionUser" type="hidden" th:value="${session.user==null?'1':'2'}"/>
			<input id="sessionUserName" type="hidden" th:if="${session.user!=null &amp;&amp; session.user.userName != null}" th:value="${session.user.userName}"/>
		</div><!--复合导航栏-->
		
		<div class="bodymain picturemain">
			<div class="bdsharebuttonbox quicklink" id="fenxiang"></div>

			<div class="alltitle atlight ">
				<div class="atlabel">精彩图库
				</div>
				<div class="atblank">
				</div>
			</div>
			<a	th:href="${'/imgModel/pictureDetail.html?id='+imgModel.id}" th:each="imgModel:${imgModelList}">
			<div class="pic-block"  th:id="${'imgDiv'+imgModelStat.count}"
				th:style="${2>=imgModelStat.count?'display: block;':'display: none;'}">
				<input type="hidden" th:value="${imgModel.id}" th:id="${'imgModelId'+imgModelStat.count}" />
				<div class="pic-title">
					<div class="pic-icon"></div>
					<span th:text="${imgModel.name}"/>
				</div>
				
			</div>
			</a>
			
			<input class="pic-more" type="button" value="加载更多 > >"  onclick="loading(this)" name="3" th:if="${imgModelList.size()>2}"/>
			<input type="hidden" th:value="${imgModelList.size()}" id="imgLen"/>
			<div class="mainbottomblank">
			</div>
		</div><!--picture-->
		<div class="footer" id="footer" th:utext="${session.indexFooter}">
		</div><!--页面底部-->
	</div>
</body>
	<script type="text/javascript" src="../../../admin/site/common/js/header.js"></script>
	<script type="text/javascript">
	$(function(){
		var len = $("#imgLen").val();
		if(len>2){
			for(var i=1;3>i ;i++){
				picLoad(i);
			}
		} else{
			for(var i=1;len>=i ;i++){
				picLoad(i);
			}
		}
		
	});
	
	function picLoad(i){
		var modelId = $("#imgModelId"+i).val();
		if(modelId != ""){
			$.post("/imgModel/getModelPic.yson", {
				"id" : modelId
			}, function(data) {
				if (data.obj) {
					$("#imgDiv"+i).append(data.content);
					$('.pic-block div:not(.pic-title) div').hover(function(){$(this).find('.pic-bg').slideDown(100);},function(){$(this).find('.pic-bg').slideUp(100);});
				}
			},"json");		
		}
	}
	
	function loading(me){
		var i = me.name;
		picLoad(i);
		var len = $("#imgLen").val();
		$("#imgDiv"+i).attr("style","display: block;");
		if(len == i){
			$(me).hide();
		} else{
			me.name = parseInt(i)+1;
		}
	}
	
	$(function(){
		  $("#nav-picture").attr("class","nav-clickon");
	});
	</script>
</html>